import React, {Component} from 'react';
import {connect} from 'react-redux';
import {TopicWrap, TopicItem} from '../style';
// import * as actionCreators from '../../../actions/HomeAction';

class Topic extends Component {



    render() {
        const {topicList} = this.props;
        return (
            <TopicWrap>
                {
                    topicList.map((item) => {
                        return (
                            <TopicItem key={item.get('id')}>
                                <img className="topic-pic" src={item.get('imgUrl')} alt="" />
                                {item.get('title')}
                            </TopicItem>
                        )
                    })
                }
            </TopicWrap>
        )
    }

    componentDidMount() {
        // this.props.getTopicList()
    }


}

const mapStateToProps = (state) => {
    return {
        topicList: state.getIn(['home','topicList'])
    }
};

// const mapDispatchToProps = (dispatch) => {
//     return {
//         getTopicList() {
//             dispatch(actionCreators.getTopicList());
//         }
//     }
// };

export default connect(mapStateToProps, null)(Topic);